import {createRouter, createWebHistory} from 'vue-router';

const router = createRouter({
  history: createWebHistory(import.meta.env.BASE_URL),
  routes: [
    {
      path: '/',
      component: () => import('@/views/ScrollActionA.vue')
    },
    {
      path: '/scroll',
      component: () => import('@/views/ScrollActionB.vue')
    }
  ],
  // 自定义滚动条行为
  scrollBehavior(to, from, savedPosition) {
    // 参数savedPosition：只有由浏览器前进/后退按钮触发的才有用
    
    // 返回期望的滚动条位置对象
    /* return {
      el: '.mark', // CSS选择器或DOM元素
      top: 100, // 若存在el则表示滚动条定位为到该el元素上方100px的位置，若不存在则表示滚动条定位到距离顶端100px的位置
      behavior: 'smooth', // 使滚动行为变得更流畅
    }; */
    
    // 返回Promise用于延迟滚动
    return new Promise(resolve => {
      setTimeout(() => {
        resolve({el: '.mark'});
      }, 1000);
    });
  }
});

export default router;
